<template>
	<view class="list">
		<view class="listBox1">
			<view class="flex topTitle f28 fb">
				<view class="title1 tac">
					中奖内容
				</view>
				<view class="title2">
					时间
				</view>
				<view class="title3 tac">
					状态
				</view>
			</view>
			<view v-if="listData.length>0" class="flex mt28" v-for="(i,k) in listData" :key="k">

				<view class="title1 fb">
					{{i.encourage == 0 ? '':i.name}}{{i.price}}
				</view>
				<view class="title2">
					{{i.createtime_text}}
				</view>
				<view class="title3 tac " v-if="i.status == 1">
					<view class="wlq tac ml24">
						{{i.status_text}}
					</view>
				</view>
				<view class="title3 tac " v-if="i.status == 0" @click="lqlj(i,k)">
					<view class="lq ml24">
						领取
					</view>
				</view>

			</view>
			<view class="mt28 tac info f28" v-if="listData.length == 0">
				暂无数据
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				listData: []
			}
		},
		onLoad() {
			this.getList()
		},
		methods: {
			lqlj(i, k) {
				this.$api.post({
					url: '/prizes/receivePrize',
					data: {
						id: i.id
					}
				}).then(res => {
					this.listData[k].status = 1
					uni.showToast({
						title: '已提现到钱包余额',
						icon: 'none'
					})
				})
			},
			getList() {
				this.$api.get({
					url: '/prizes/getUserPrizesList',
					data: {
						page: '1',
						limit: '999'
					}
				}).then(res => {
					console.log(res);
					if (res.data) {
						this.listData = res.data
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.list {
		width: 100%;
		height: 100vh;
		background-image: url('https://img.aibbyp.com/wechatUser/asda.png');
		background-size: 100% 100vh;
		background-repeat: no-repeat;
		padding: 60rpx 48rpx;
		color: #FC5034;

		.wlq {
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			border: 1rpx solid #FC5034;
			width: 126rpx !important;
			height: 42rpx;
			line-height: 42rpx;
		}

		.lq {
			background: #FC5034;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			font-size: 24rpx;
			color: #FFFFFF;
			width: 126rpx !important;
			height: 42rpx;
			line-height: 42rpx;
		}

		.listBox1 {
			background: #FFFFFF;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			padding: 28rpx 40rpx;
			height: calc(100% - 20rpx);
			overflow-y: scroll;
			.topTitle {
				color: #BF3100;


			}

			.title1 {
				width: 40%;

			}

			.title2 {
				width: 29%;

			}

			.title3 {
				width: 30%;

			}
		}
	}
</style>